// 引入依赖
import Vue from 'vue'
import Vuex from 'vuex'

// 导入type的文件
import {changeMoney, changeMoney1} from './mutation-types'

// 引入模块
import user from './user/index'

// 使用中间件
Vue.use(Vuex)

// 创建实例
const store = new Vuex.Store({
    // 存储数据，类似组件中的data
    state: {
        money: 999999,
        age: 18
    },
    // 类似组件中的计算属性，可以对state进行进一步的计算
    getters: {
        nextAge(state) {
            return state.age + 1
        }
    },
    // 修改数据，类似组件中的methods
    mutations: {
        // 年龄增加
        beOld(state) {
            state.age += 1;
        },
        // 传参的情况
        [changeMoney](state, payload) {
            // console.log(payload);
            state.money += payload
        },
        // 对象风格的提交方式
        [changeMoney1](state, payload) {
            // console.log(state, payload);
            state.money += payload.val
        },
    },
    // 作用是修改数据，和mutation不同之处：
    // 1这里是异步修改mutation是同步的 2这里不能直接修改，还得经过mutation
    // action是mutation的进一步封装 action = axios + mutation
    actions: {
        changeMoneyPro(state, mutation) {
            axios.post('/xxxxxx', {money: this.val*1})
            .then(res => {
                console.log(res.data.money);
                // 从这里开始 已经是同步代码了 可以用mutation了
                this.$store.commit(changeMoney, res.data.money)
            })
        }
    },
    // 每一个模块都是一个完整的结构，可以包含之前的4个核心
    modules: {
        goods:{
            state: {
                name: '士力架',
                price: 5
            }
        },
        user: user
    }
})

// 暴露出来
export default store